<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<p><p align="center"><strong><font size="50px">会议室预订系统</font></strong></p></p>
<style>
#main{ width:980px; height:auto!important; overflow:hidden; visibility:visible; margin:auto; margin-top:0px;}
#left{ width:150px;height:340px;float:left; border:#CCCCCC 1px solid;}
#right{ width:598px; float:left; border:#CCCCCC 1px solid; height:300px; padding-top:40px;}
</style>
<script>
function testdata(obj){
document.getElementById('right').innerHTML=obj;
 }
</script>
</head>

<body >
<div id="main">
<!--左侧栏目-->
<div id="left">
<ul style="cursor:hand">
<li onclick="testdata('一层.这里放立体图')">第一层</li>
<li onclick="testdata('二层.这里放立体图')">第二层</li>
<li onclick="testdata('三层.这里放立体图')">第三层</li>
<li onclick="testdata('四层.这里放立体图')">第四层</li>
<li onclick="testdata('五层.这里放立体图')">第五层</li>
</ul>
</div>
<!--右侧内容-->
<div id="right" style="cursor:hand">这里将显示左侧栏目的内容</div>
</div>
</body>
</html>